<template>
    <div>
        <!-- 背景 -->
        <div class="back">
            <!-- 导航栏 -->
            <div class="nav">
                <i class="iconfont icon-xiangzuojiantou"></i>
                <div class="text">密码登录</div>
            </div>
            <!-- logo -->
            <div class="logo">
                <img src="./assets/image/logo.png" alt="">
            </div>
            <!-- 登录框 -->
            <div class="log-box">
                <div class="log">
                    <div class="input">
                        <input type="text" v-model="form.username" placeholder="请输入手机号">
                    </div>
                    <div class="input">
                        <input type="password" v-model="form.password" placeholder="请输入密码">
                        <!-- 验证码 -->
                        <div class="code">获取验证码</div>
                    </div>
                    <div class="log-center" @click="deng">登录</div>
                    <!-- 协议 -->
                    <div class="agreement-box">
                        <input type="checkbox">
                        <div class="agreement"> 我已阅读并同意 《乐康养老用户协议》 《隐私权限》</div>
                    </div>
                    <!-- 忘记密码 -->
                    <div class="forget-box">
                        <div></div>
                        <div class="forget">忘记密码</div>
                    </div>
                </div>

            </div>
        </div>
    </div>

</template>
<script>
function adapter() {
    //获取布局视口宽度，因为开启了理想视口，布局视口=设备横向独立像素值
    const dpWidth = document.documentElement.clientWidth
    //计算根字体大小
    const rootFonstSize = (dpWidth * 100) / 1125
    //设置根字体大小
    document.documentElement.style.fontSize = rootFonstSize + 'px'
}
adapter()
window.onresize = adapter
export default {
    name: 'loginViews',
    data() {
        return {
            form: {}
        };
    },
    methods: {

        deng() {
            this.$store.dispatch('login', this.form)
            //   console.log(this.form);

        }
    }
}
</script>
<style>
@import "./assets/css/base.css";
@import "./assets/css/dengli.css";
@import "./assets/font/iconfont.css";
</style>
